<template>
  <div class="form-single-fragment" style="position: relative;">
    <el-form :model="infoDetail" label-width="170px" size="mini" label-position="right">
      <h4 class="clearfix">
        <img class="fl" src="@/assets/img/icon_info.png" />
        <el-button class="fr" type="text" icon="el-icon-edit-outline" @click="customerEdit(infoDetail)" v-if="verifyStatus!=1">编辑</el-button>
      </h4>
      <el-row class="el-form-info">
        <el-col :span="24">
          <el-form-item label="项目名称：">{{infoDetail.projectName}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="项目编号：">{{infoDetail.projectCode}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="项目地点：">{{infoDetail.areaName}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="业务类型：">{{infoDetail.businessTypeName}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="单位名称：">{{infoDetail.customerName}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="项目状态：">{{infoDetail.projectStatusName}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="创建时间：" v-if="infoDetail.createTime">{{infoDetail.createTime.substring(0,10)}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="项目开始时间：">{{infoDetail.beginDate}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="项目完成时间：">{{infoDetail.endDate}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="实际完成时间：">{{infoDetail.actualFinishDate}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="项目属性：">{{infoDetail.projectAttribute==1?'公司项目':'合作单位'}}</el-form-item>
        </el-col>
        <el-col :span="12" v-if="infoDetail.projectAttribute==2">
          <el-form-item label="合作单位：">{{infoDetail.cooperateCompanyName}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="商机负责人：">{{infoDetail.directorName}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="关联商机名称：">{{infoDetail.businessOpportunityName}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <!-- <el-form-item label="关联商机编码：">{{infoDetail.businessOpportunityCode}}</el-form-item> -->
          <el-form-item label="关联商机编码：">{{infoDetail.businessCode}}</el-form-item>
        </el-col>
        <el-col :span="12" v-if="infoDetail.stageNumber">
          <el-form-item label="项目标段：">{{infoDetail.stageNumber?'标段'+infoDetail.stageNumber:''}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="项目总投资(万元)：">{{infoDetail.projectTotalAmount}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="工程投资：">{{infoDetail.projectInvestmentAmount}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="行业：">{{infoDetail.industryShowName}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="监督部门：">{{infoDetail.superviseDept}}</el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="审批部门：">{{infoDetail.approvalDept}}</el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="项目简介：">{{infoDetail.projectBrief}}</el-form-item>
        </el-col>
        <el-col :span="24">
          <el-form-item label="备注：">{{infoDetail.remarks}}</el-form-item>
        </el-col>
      </el-row>
    </el-form>
  </div>
</template>

<script>
import { Administration } from '@/api/projectAdministration.js';
import Synopsisadd from './Synopsisadd.vue';
export default {
  name: 'Opportunitiesadd',
  data () {
    return {
      loading: false,
      isShowloading: false,
      verifyStatus: '',
      infoDetail: {}
    };
  },
  created () {
  },
  computed: {
  },
  mounted () {
    this.verifyStatus = this.$route.query.verifyStatus
    this.loadDetailWidgetData()
  },
  methods: {
    /**
     * 项目简介
     */
    loadDetailWidgetData () {
      let params = {
        id: this.$route.query.projectId
      };
      return new Promise((resolve, reject) => {
        Administration.detail(this, params).then(res => {
          this.infoDetail = res.data
        }).catch(e => {
          reject(e);
        });
      });
    },
    // 项目编辑
    customerEdit (row) {
      this.$dialog.show('编辑', Synopsisadd, {
        area: '800px'
      }, {
        projectId: this.$route.query.projectId
      }).then(res => {
        this.loadDetailWidgetData()
      }).catch(e => {
      });
    }
  }
}
</script>

<style lang="scss" scoped>
h4{margin-bottom: 0;}
.table_container{margin: 10px 0;}
.form-single-info{
  display: flex;justify-content: center;
  li{list-style: none;}
}
.form-single-info>.el-col{position: relative;}
.form-button-right{position: absolute;right: 0;top: 12px;}
.el-form-info{box-shadow: 0 0 10px rgba(0,0,0,0.05);padding: 20px;}
/deep/.el-tabs__nav-wrap::after{display: none;}
/deep/.el-tabs__item.is-active{color: #051D69;font-weight: bold;}
/deep/.el-tabs__active-bar{background-color: #051D69;}
ul{
  padding: 0 7px;
  .primary,.warning,.success{box-shadow: 0px 0px 7px 0px rgba(77, 165, 255, 0.3);text-align: center;padding: 10px 0;font-weight: bold;margin-bottom: 10px;}
  .primary{color: #3a8ee6;border-top: 2px solid #409EFF;}
  .warning{color: #cf9236;border-top: 2px solid #e6a23c;}
  .success{color: #5daf34;border-top: 2px solid  #67c23a;}
  li{margin: 10px 0;}
}
</style>
